<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml" xmlns="http://java.sun.com/jsf/html">

<head>
	<meta http-equiv="Content-type" content="text/html; charset=utf-8" />
	<title>湖南省自来水公司营销管理信息系统</title>

	<link rel="stylesheet" href="../../../css/reset.css" type="text/css" media="screen" title="no title" />
	<link rel="stylesheet" href="../../../css/text.css" type="text/css" media="screen" title="no title" />
	<link rel="stylesheet" href="../../../css/form.css" type="text/css" media="screen" title="no title" />
	<link rel="stylesheet" href="../../../css/buttons.css" type="text/css" media="screen" title="no title" />
	<link rel="stylesheet" href="../../../css/grid.css" type="text/css" media="screen" title="no title" />
	<link rel="stylesheet" href="../../../css/layout.css" type="text/css" media="screen" title="no title" />

	<link rel="stylesheet" href="../../../css/ui-darkness/jquery-ui-1.8.12.custom.css" type="text/css" media="screen" title="no title" />
	<link rel="stylesheet" href="../../../css/plugin/jquery.visualize.css" type="text/css" media="screen" title="no title" />
	<link rel="stylesheet" href="../../../css/plugin/facebox.css" type="text/css" media="screen" title="no title" />
	<link rel="stylesheet" href="../../../css/plugin/uniform.default.css" type="text/css" media="screen" title="no title" />
	<link rel="stylesheet" href="../../../css/plugin/dataTables.css" type="text/css" media="screen" title="no title" />

	<link rel="stylesheet" href="../../../css/custom.css" type="text/css" media="screen" title="no title">
<style type="text/css">
#t_meterCount { text-align:right; width:30px; vertical-align:middle; }
</style>
<script type="text/javascript">
function setMeter(){
	var n = $('#t_meterCount').val();
	if(isNaN(n))return;    //不是数字
	if(n<=0||n>100)return; //不合理
	var rows = $('table.data tbody tr');
	if(rows.length == n)return; //行数相同

	if(rows.length<n){//需增加行数
		for(var i=rows.length;i<n;i++){
			$('table.data tbody').append('<tr><td>' + (i+1) +
				'</td><td><input class="username"/></td><td><input class="phone"/></td><td><input class="smsphone"/></td><td><input class="address"/></td><td></td></tr>');
		}
	}else{//需减少行数
		$('table.data tbody tr:gt('+(n-1)+')').remove();
	}


}
</script>
</head>

<body>

<div id="wrapper">
	<#include "../common/header.ftl"/>

	<div id="content" class="xgrid">
        <input type="hidden" id="ordno" value="${ordno}">
		<div class="x12">

			<h2>
				用户申请 - 办理新开户业务
				<a style="float:right" href="javascript:history.back(-1);">返回</a>
			</h2>

			<div class="tab_container">
				<ul class="tabs">
					<li><a href="#tab1">申请表</a></li>
                    <li><a href="#tab2">新户详细表</a></li>
				</ul>
				<div class="tab_content_container">
					<div id="tab1" class="tab_content">
                        <table width="100%">
                            <thead>
                            <tr>
                                <th width="60"></th>
                                <th width="220"></th>
                                <th width="60"></th>
                                <th></th>
                            </tr>
                            </thead>
                            <tbody>
                            <tr>
                                <td>用户名称</td>
                                <td><input id="username" /></td>
                                <td>用户类型</td>
                                <td><select style="width:158px;" id="usertype">
                                    <option>公户</option>
                                    <option selected="selected">私户</option>
                                </select>
                                </td>
                            </tr>
                            <tr>
                                <td>联系人</td>
                                <td><input id="linkman" /></td>
                                <td>联系电话</td>
                                <td><input id="phone" /></td>
                            </tr>
                            <tr>
                                <td>用户地址</td>
                                <td colspan="3"><input size="68" id="address"/></td>
                            </tr>
                            <tr>
                                <td>用水量</td>
                                <td><input id="maxamount"/></td>
                                <td>申请表径</td>
                                <td><select style="width:158px;" id="metertypeid">
                                    <option value="1">DN10</option>
                                    <option selected="selected" value="2">DN15</option>
                                    <option value="3">DN20</option>
                                    <option value="4">DN40</option>
                                    <option value="5">DN80</option>
                                    <option value="6">DN100</option>
                                    <option value="7">DN200</option>
                                    <option value="8">DN500</option>
                                    <option value="9">DN1000</option>
                                </select>
                                </td>
                            </tr>
                            <tr>
                                <td>房屋层次</td>
                                <td><input id="househeight" /></td>
                                <td>接水用途</td>
                                <td><input id="usetarget"/></td>
                            </tr>
                            <tr>
                                <td>备注说明</td>
                                <td colspan="3"><input size="68" id="userremark"/></td>
                            </tr>
                            </tbody>
                        </table>
					</div>
					<div id="tab2" class="tab_content">
						申请装表表数 <input id="t_meterCount" value="1" />
						<button class="btn btn-small" onClick="setMeter();">确定</button>
						<div id="meters">
							<table class="data display">
							<thead>
								<tr>
                                    <th width="30">序号</th>
                                <th width="160">姓名</th>
                                <th width="160">电话</th>
                                <th width="160">短信号码</th>
                                <th width="160">地址</th>
                                <th></th>
                                </tr>
                                </thead>
							<tbody>
								<tr>
									<td>1</td>
									<td><input class="username"/></td>
									<td><input class="phone"/></td>
									<td><input class="smsphone"/></td>
									<td><input class="address"/></td>
									<td></td>
								</tr>
							</tbody>
							</table>
						</div>
					</div>
                    <div class="centerButtons">
                        <button class="btn" id="go">办理</button>
                        <input type="hidden" id="createemp" value="${user.id}">
                        <button class="btn btn-grey" onClick="history.back(-1);">返回</button>
                    </div>
				</div>
			</div>

		</div> <!-- .x12 -->



	</div> <!-- #content -->

	<div id="footer">
		<div class="content_pad">
			<p>&copy; 2013-11 版权所有 <a href="#">湖南省自来水公司</a>.   技术支持 <a href="#">华瑞教育</a>.</p>
		</div> <!-- .content_pad -->
	</div> <!-- #footer -->

</div> <!-- #wrapper -->

<script src="../../../js/jquery/jquery-1.5.2.min.js"></script>
<script src="../../../js/jquery/jquery-ui-1.8.12.custom.min.js"></script>
<script src="../../../js/misc/excanvas.min.js"></script>
<script src="../../../js/jquery/facebox.js"></script>
<script src="../../../js/jquery/jquery.visualize.js"></script>
<script src="../../../js/jquery/jquery.dataTables.min.js"></script>
<script src="../../../js/jquery/jquery.tablesorter.min.js"></script>
<script src="../../../js/jquery/jquery.uniform.min.js"></script>
<script src="../../../js/jquery/jquery.placeholder.min.js"></script>

<script src="../../../js/widgets.js"></script>
<script src="../../../js/dashboard.js"></script>

<script type="text/javascript">

$(document).ready ( function ()
{
	Dashboard.init ();

	//选项卡初始化
	$('.tab_container').tabs ();
});

</script>
<script type="text/javascript">
    $(function () {
        /**
         * 获取表格数据
         * @param tableHtml 表格Html
         * @returns {Array}
         */
        function getTableData(tableHtml) {
            var result = [];
            if (tableHtml) {
                var length = tableHtml.length;
                for(var i = 0; i < length; i++) {   //追加数据
                    var trData = {}; // 每行的数据
                    //注意text()和val()的区别
                    var username = $(tableHtml).eq(i).find('.username').val();
                    var phone = $(tableHtml).eq(i).find('.phone').val();
                    var smsphone = $(tableHtml).eq(i).find('.smsphone').val();
                    var address = $(tableHtml).eq(i).find('.address').val();
                    var orderno=$(tableHtml).eq(i).find('.orderno').val();
                    // //数据赋值
                    trData.username = username;
                    trData.phone = phone;
                    trData.smsphone = smsphone;
                    trData.address = address;
                    trData.orderno = orderno;
                    result.push(trData);    //数据追加
                }
            }
            return result;
        }
        //处理
        $("#go").click(function () {
            var tableHtml = $(document).find('table.data tbody tr');
            var data = getTableData(tableHtml);
            var jj=JSON.stringify(data);
            var uname = $("#username").val()//用户姓名
            var utype = $("#usertype").val()//用户类型
            var ulinus = $("#linkman").val()//联系人
            var uphone = $("#phone").val()//电话号码
            var umeterid = $("#metertypeid").val()//申请表径
            var umaxamout = $("#maxamount").val()//用水量
            var usetarget = $("#usetarget").val()//接水用途
            var useremark = $("#userremark").val()//备注说明
            var househeight = $("#househeight").val()//房屋楼层
            var address = $("#address").val()//用户地址
            // var c_username = $(".username").val()//接水用途
            var c_phone = $(".phone").val()//备注说明
            var c_smsphone = $(".smsphone").val()//房屋楼层
            var c_address = $(".address").val()//用户地址
            if(uname==""){
                alert("用户姓名不能为空")
                return false
            }
            if(ulinus==""){
                alert("联系人不能为空")
                return false
            }
            if(uphone==""||uphone.length!=11){
                alert("电话号码有误")
                return false
            }
            if(umaxamout==""){
                alert("用水量不能为空")
                return false
            }
            if(usetarget==""){
                alert("接水用途不能为空")
                return false
            }
            if(househeight==""){
                alert("房屋楼层不能为空")
                return false
            }
            if(address==""){
                alert("地址不能为空")
                return false
            }
            if(useremark==""){
                alert("备注说明不能为空");
                return false
            }
            if ($(".username").val()=="") {
                alert("新户详细不能为空")
                return false
            }
            if(c_phone==""||c_phone.length!=11){
                alert("联系电话不能为空")
                return false
            }
            if(c_smsphone==""||c_smsphone.length!=11){
                alert("短信电话号码有误")
                return false
            }
            if(c_address==""){
                alert("地址不能为空")
                return false
            }
            var ordno= $("#ordno").val();
            if (ordno==0000){
                $.ajax({
                    url:"/beOrder/addnewClient",    //请求的url地址
                    dataType:"json",   //返回格式为json
                    async:true,//请求是否异步，默认为异步，这也是ajax重要特性
                    data:{
                        "username":$("#username").val(),
                        "usertype":$("#usertype").val(),
                        "linkman":$("#linkman").val(),
                        "phone":$("#phone").val(),
                        "metertypeid":$("#metertypeid").val(),
                        "maxamount":$("#maxamount").val(),
                        "userremark":$("#userremark").val(),
                        "usetarget":$("#usetarget").val(),
                        "househeight":$("#househeight").val(),
                        "address":$("#address").val(),
                        "ordertype":1,
                        "createemp":$("#createemp").val(),
                        "lasteditemp":$("#createemp").val(),
                        "metercount":$("#t_meterCount").val(),
                        "list":jj
                    },
                    type:"post", //请求方式
                    success:function(succ){
                        var a=eval(succ);
                        $('#orderno').val(a.orderno)
                        $("#tab1").find("input").each(function(){
                            this.value ="";
                        });
                        $("#tab2").find("input").each(function(){
                            this.value ="";
                        });
                        window.location.href="http://localhost:8090/suces?pagename=request1";
                    }
                });
            }else {
                $.ajax({
                    url:"/beOrder/addnewClient",    //请求的url地址
                    dataType:"json",   //返回格式为json
                    async:true,//请求是否异步，默认为异步，这也是ajax重要特性
                    data:{
                        "username":$("#username").val(),
                        "usertype":$("#usertype").val(),
                        "linkman":$("#linkman").val(),
                        "phone":$("#phone").val(),
                        "metertypeid":$("#metertypeid").val(),
                        "maxamount":$("#maxamount").val(),
                        "userremark":$("#userremark").val(),
                        "usetarget":$("#usetarget").val(),
                        "househeight":$("#househeight").val(),
                        "address":$("#address").val(),
                        "ordertype":1,
                        "createemp":$("#createemp").val(),
                        "lasteditemp":$("#createemp").val(),
                        "orderno":$("#ordno").val()
                    },
                    type:"post",//请求方式
                    success:function(succ){
                        $("#tab1").find("input").each(function(){
                            this.value ="";
                        });
                        window.location.href="http://localhost:8090/suces?pagename=request1";
                    }
                });
            }
        })
    })

</script>

</body>

</html>